import React, { useEffect, useState } from 'react'
import { useLocation, useNavigate } from 'react-router-dom'
import Navbar from '../../components/Navbar'
import { List } from 'antd-mobile'
import "../../style/home/sell.scss"
import { categorybrandprolist } from '../../apis/classify'
export default function Brand() {
    const location = useLocation()
    const navigate = useNavigate()
    const [list, setlist] = useState([])
    useEffect(() => {
        lists()
    }, [])
    let lists = async () => {
        let res = await categorybrandprolist(1, 10, location.state.activeKey, location.state.brand)
        setlist(res.data)

    }

    let run = (proid: any) => {
        navigate("/details", { state: { proid } })
    }
    return (
        <div>
            <Navbar title={location.state.brand} />

            <List className="sell">
                {
                    list &&
                    list.length &&
                    list.map((item: any) => (
                        <List.Item arrow={false} key={item.proid} className="item" onClick={() => { run(item.proid) }}>
                            <img src={item.img1} alt="" />
                            <p className='proname'>{item.proname}</p>
                            <p className='price'>￥ {item.originprice}</p>
                        </List.Item>
                    ))
                }
            </List>
        </div>
    )
}
